{% extends "base.html" %}
{% load i18n %}

{% block title %} {{item.name}} - Mr. Edu {%endblock%}

{% block section%}

	<p id="breadCrumbs">
		<a href="/mrEdu/{{userRole}}/collections">{% trans "[BREADCRUMB] My folders" %}</a>
		<span class="hidden">&gt;</span>
		<a href="/mrEdu/{{userRole}}/collection/{{item.collection.id}}/">{{item.collection.name}}</a>
		<span class="hidden">&gt;</span>
		<span class="itemName">{{item.name}}</span>
	</p>
	
	{% if item.type == 'video/ogg'%}
	<h1>{{item.name}}</h1>
	<div class="colLeft">
		<video width="500" height="278" controls="controls" autoplay="autoplay">
  			<source src="/static/uploads/{{item.resource}}" type="video/ogg">
			<p>Your browser does not support the video tag.</p>
		</video>
	</div>
	
	<div class="colRight">
		<table class="itemDetails">
			<tr>
				<th>{% trans "[FILE] Uploaded" %}:</th>
				<td>{{item.creation_date}}</td>
			</tr>
			<tr>
				<th>{% trans "[FILE] Tags" %}:</th>
				<td>
				{% for i in item.tags.all %}
				<span class="tag">{{i.name}}</span><span class="hidden">,</span>
				{% endfor %}
				</td>
			</tr>
		</table>
	</div>
	{% endif %}
	
	{% if 'audio' in item.type %}
	<h1>{{item.name}}</h1>
	<div class="colLeft">
		<audio controls="controls" autoplay="autoplay">
			<source src="/static/uploads/{{item.resource}}" type="{{item.type}}">
			<p>Your browser does not support the video tag.</p>
		</audio>
	</div>
	
	<div class="colRight">
		<table class="itemDetails">
			<tr>
				<th>{% trans "[FILE] Uploaded" %}:</th>
				<td>{{item.creation_date}}</td>
			</tr>
			<tr>
				<th>{% trans "[FILE] Tags" %}:</th>
				<td>
				{% for i in item.tags.all %}
				<span class="tag">{{i.name}}</span><span class="hidden">,</span>
				{% endfor %}
				</td>
			</tr>
		</table>
	</div>
	{% endif %}
	
	{% if item.type == 'text/plain'%}
	<h1>{{item.name}}</h1>
	<div class="colLeft">
		<div class="textPreview">
{{item.resource}}
		</div>
	</div>
	
	<div class="colRight">
		<table class="itemDetails">
			<tr>
				<th>{% trans "[FILE] Uploaded" %}:</th>
				<td>{{item.creation_date}}</td>
			</tr>
			<tr>
				<th>{% trans "[FILE] Tags" %}:</th>
				<td>
				{% for i in item.tags.all %}
				<span class="tag">{{i.name}}</span><span class="hidden">,</span>
				{% endfor %}
				</td>
			</tr>
		</table>
	</div>
	{% endif %}
	
	{% if item.type == 'image/jpeg'%}
	<h1>{{item.name}}</h1>
	<div class="colLeft">
		<img src="/static/uploads/{{item.resource}}" width="540" height="405" alt="{{item.description}}">
	</div>
	
	<div class="colRight">
		<table class="itemDetails">
			<tr>
				<th>{% trans "[FILE] Uploaded" %}:</th>
				<td>{{item.creation_date}}</td>
			</tr>
			<tr>
				<th>{% trans "[FILE] Tags" %}:</th>
				<td>
				{% for i in item.tags.all %}
				<span class="tag">{{i.name}}</span><span class="hidden">,</span>
				{% endfor %}
				</td>
			</tr>
		</table>
	</div>
	{% endif %}
{%endblock%}